<template>
  <div class="recommend-wrap">
    <ul class="recommend-list">
      <li class="recommend-item"
          v-for="item of list"
          :key="item.id">
        <component-shop :shopInfo="item"
                        @show="handleShow"></component-shop>
      </li>
    </ul>
  </div>
</template>

<script>
import ComponentShop from 'common/shop'
export default {
  name: 'HomeRecommend',
  props: {
    list: {
      type: Array
    }
  },
  components: {
    ComponentShop
  },
  methods: {
    handleShow (falg) {
      this.$emit('show', falg)
    }
  }
}
</script>

<style lang="stylus" scoped>
@import '~stylus/variable.styl'
@import '~stylus/mixins.styl'

.recommend-wrap
  min-height 500px
  width 100%

  .recommend-item
    margin-bottom 37px
</style>
